@import _custom.sass

body
  font-family: Arial, Helvetica, sans-serif
  font-size: 12px
  margin: 0
  padding: 0
  outline: 0 none
  vertical-align: baseline
  background-repeat: no-repeat !important
  background-attachment: fixed !important

h1, h2, h3, h4, h5, h6
  margin: 25px 0 20px 0
  line-height: 120%
  text-shadow: 1px 1px 1px #EAF1EA
  font-family: Myriad Pro,"Lucida Grande","Lucida Sans Unicode",Segoe UI,Helvetica,Arial,sans-serif

h1
  font-size: 32px
  margin: 0 0 15px 0

h2
  font-size: 20px
  color: #1487d4
  font-weight: normal

h3
  font-size: 130%

h4
  font-size: 110%

.front .node h1
  font-size: 30px
  color: #494d4f
  font-weight: normal
  &.front-heading
    margin-bottom: 0
    font-weight: bold

.node.node-teaser h2
  margin-top: 0

.subtitle
  padding: 5px 0 15px 0
  font-size: 18px
  color: #494d4f
  font-family: Myriad Pro,"Lucida Grande","Lucida Sans Unicode",Segoe UI,Helvetica,Arial,sans-serif

input, textarea, select
  font-family: "Lucida Grande","Lucida Sans Unicode",Segoe UI,Helvetica,Arial,sans-serif

#footer-bottom
  h1, h2, h3, h4, h5, h6
    text-shadow: none

p
  margin: 0 0 25px 0

a, li a.active
  text-decoration: none

a img
  border: none
  outline: none
  overflow: hidden

img.masked, .field-type-image img
  background: transparent url('../images/pattern.png')
  border: 1px solid #d8d8d8
  padding: 10px
  margin: 10px 0

img
  max-width: 100%
  height: auto
  -webkit-box-sizing: border-box
  -moz-box-sizing: border-box
  box-sizing: border-box

code
  font-family: "Courier New", Courier, monospace

blockquote
  background: transparent url('../images/blockquote.png') no-repeat top left
  margin: 40px 0
  padding: 0 55px

.breadcrumb
  padding: 10px
  color: #8D3133
  font-size: 14px
  a
    color: #8D3133
    &:hover
      +text-shadow(0 1px 1px #bdbdbd)

.breadcrumb-separator
  padding: 0 8px 0 4px

.submitted
  margin: -15px 0 20px 0
  font-size: 85%
  text-transform: uppercase

.region-content
  line-height: 155%

#site-name
  font-size: 130%

/* 
 ** Layout **/

#header
  clear: both
  #header-inside
    margin: 0 auto
    padding: 0
    overflow: hidden
    background-color: #fff
    #logo
      display: block
      overflow: hidden
      padding-left: 5px
      margin: 0
      float: left
      img
        padding: 0
        margin: 0
        display: block
        overflow: hidden
        width: 130px
    #name-and-slogan
      font-size: 28px
      font-family: Verdana, Arial, Helvetica, sans-serif
      padding: 0px
      line-height: 60px
      color: #0229FD
    #site-name
      a
        color: #0229FD
    #site-slogan
      font-size: 20px
  .region-header
    #block-block-5
      color: red
      font-weight: bold
      text-align: center
      font-size: 28px
      margin-bottom: 5px
      p
        padding: 0px
        margin: 0px

#header-menu
  clear: both


#banner
  clear: both
  overflow: hidden
  .flexslider 
    max-width: 960px
    margin: 0px auto
    .views-field-title
      bottom: 0
      color: #FFFFFF
      left: 0
      padding: 3%
      position: absolute
      text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3)
      width: 94%
      background-color: rgba(0,0,0, .75)
      h3
        color: #9DCEDF

#content
  clear: both
  overflow: hidden

#content-inside
  padding: 0px
  #sidebar-first
    width: 195px
    background-color: #fff
  #main
    width: 765px
    #page-title
      padding-left: 20px
      border-bottom: 1px solid #ccc
    .region-content
      padding: 10px

.no-sidebars
  #main
    padding-top: 10px
    padding-bottom: 10px
  #sidebar
    display: none

.meta-data
  font-size: 75%
  text-transform: uppercase
  color: #545454
  margin: 5px 0 20px 0
  display: block
  overflow: hidden
  clear: both

#footer
  clear: both
  overflow: hidden
  color: #FFF
  padding-bottom: 30px
  a:hover
    color: #FFF
    text-decoration: underline
  .container_12
    padding: 10px 0
    text-align: center
    font-size: 13px
    +radial_gradient(#6db3f2, #1a3282, center)
    +rounded_corners(0px, 0px, 5px, 5px, none)
    .block
      color: #FFF
      margin: 0
      a
        color: #FFF
        text-decoration: none
        &:hover, &:focus, &:active
          +text-shadow(0px 0px 3px  rgba(255, 255, 255, 0.75))
  ul.menu
    margin: 0 auto
    display: table
    float: none
    li
      border: 0
      display: block
      float: left
      margin: 0
      padding: 0
      width: auto
      list-style: none
      &:first-child
        border-left: none
      a
        float: left
        padding: 5px 10px
        text-indent: 0
        background: none
        font-weight: bold
        text-transform: uppercase
        color: #fff
  #block-block-3
    margin-top: 10px
    .block-content
      margin: 10px 0px
      line-height: 24px
      font-size: 14px

.node.node-teaser
  margin-bottom: 60px

#footer-bottom
  clear: both
  overflow: hidden
  padding: 40px 0

/*
 ** Sidebar Blocks - Menus */
.region-sidebar-first, .region-sidebar-second
  .block
    h2
      margin: 0
      padding: 5px 5px 5px 15px
      background-color: #852325
      color: #FFF
      position: relative
    .content
      overflow: hidden
      margin: 0
      //+rounded_corners(5px)
      /* shadow */
      //+box-shadow(0 3px 6px #efefef inset)
  #block-block-1
    .content
      text-align: center
      #phone p
        color: #993300
        font-size: 13px
        font-weight: bold
        line-height: 37px
        margin: 5px 0px
      #tuvan p
        color: #000000
        font-size: 11px
        font-weight: bold
        margin: 5px 0px
      ul
        margin: 5px
        padding: 0px
        li
          list-style: none
          margin: 0px
          padding: 0px
          display: inline-table
  #block-block-4
    .content
      padding: 10px 0px
      text-align: center


  .block-on-the-web
    .content
      text-align: center
.region-sidebar-first, .region-sidebar-second
  ul.menu
    margin: 0
    padding: 0
    li
      list-style: none
      margin: 0
      padding: 5px 0 5px 15px
      border-bottom: 1px solid #e7e7e7
      display: block
      float: none
      background: url("../images/menu-collapsed.png") no-repeat scroll 5px center rgba(0, 0, 0, 0)
      a
        color: #8D3133
        padding: 5px
        font-weight: bold
      &.expanded
        border-bottom: none
        background: url("../images/menu-expanded.png") no-repeat scroll left 10px transparent
      &.collapsed
        background: url("../images/menu-collapsed.png") no-repeat scroll left 10px transparent
        > a
          padding-left: 15px
      &.last
        border: none
      &:hover
        background-color: rgba(0,0,0, .75)
        a
          color: #fff

    ul.menu
      padding: 0 0 0 15px       

.region-sidebar-first
  .block-simpleads
    .content
      height: 273px
/* 
 ** Contact
 */

.contact-form
  margin: 10px 0

.filter-wrapper
  border: 1px solid #DDDDDD
  border-top: none

.user-picture
  float: left
  padding: 0 20px 10px 0

/*
 ** About
 */

.about-features
  padding: 60px 0 0 0

.about-members
  clear: both
  padding: 10px 0 0 0

.about-member
  background: transparent url('../images/pattern.png')
  border: 1px solid #e4e4e4
  padding: 15px
  margin-bottom: 15px

.about-feature h2
  margin-top: 0

.about-member p
  margin: 0

/*
 ** Products
 */

.product
  margin-bottom: 60px
  h2
    margin: 0 0 5px 0

.product-subtitle
  padding: 0 0 10px 0

/*
 ** Services*/

.services
  clear: both
  padding: 20px 0

/* 
 ** Main-menu
/* 1st Level*/

#header-menu 
  ul.menu
    display: block
    padding: 0
    margin: 0
    position: relative
    z-index: 99999
    li
      display: inline-block
      float: left
      vertical-align: middle
      padding: 0
      margin: 0
      a
        outline: none
        text-decoration: none
        margin: 0 20px
        padding: 10px 5px
        font-size: 14px
        font-weight: bold
        text-align: center
        text-transform: uppercase
        font-family: Myriad Pro,"Lucida Grande","Lucida Sans Unicode",Segoe UI,Helvetica,Arial,sans-serif
        display: block
        line-height: 42px
        &:hover, &.active
          color: #fff
        &:after
          content: none
      &.expanded
        position: relative
        a
          background: transparent url('../images/menu-expanded.png') no-repeat center right
          padding: 10px 15px 10px 10px
        ul.menu
          width: 230px
          z-index: 100
          padding: 0
          display: none
          position: absolute
          li
            a
              padding: 10px
              margin: 0
              display: block
              width: 210px
              text-align: left
              line-height: 130%
              background: none
              font-size: 12px
            &.expanded a:hover
              background: #1b1b1b url('../images/menu-collapsed.png') no-repeat center right
            &.leaf a:hover
              background: #1b1b1b
        &:hover
          display: block
          > ul.menu
            display: block
          &.expanded
            background: transparent url('../images/menu-collapsed.png') no-repeat center right

/* 2nd Level

/* 3rd, 4th, 5th, (...) level

/* 
 ** Superfish support*/
#navigation
  //+rounded_corners(5px, 5px, 0px, 0px)
  .block-superfish
    ul.sf-menu
      margin: 0
      padding: 0
      > li.first
        +rounded_corners(5px, 0px, 0px, 0px)
      li
        a
          color: #ffffff
          &.menuparent
            padding: 10px 30px 10px 10px
        li
          background: rgba(0,0,0, .55)
          a
            margin: 0
            padding: 5px 10px
            font-size: 12px
            font-weight: normal
            text-align: left
            line-height: 32px
            border-bottom: 1px solid #353535
        &:hover, &.sfHover
          background: #222
          ul
            top: 60px
            ul
              top: 0
        ul
          width: 173px !important
          overflow: hidden
  select
    width: 100%
    margin: 10px 0
    padding: 5px

/* 
 ** Footer-bottom menu*/
ul.secondary-menu, #footer-bottom ul.menu
  padding: 0
  margin: 0 0 10px 0
  display: block
  overflow: hidden

ul.secondary-menu li, #footer-bottom ul.menu li
  display: block
  float: left
  list-style-type: none
  overflow: hidden
  padding: 0 10px
  margin: 0

ul.secondary-menu li.first, #footer-bottom ul.menu li.first
  padding: 0 10px 0 0
  margin: 0

ul.secondary-menu li.last
  border-right: none
  margin: 0

#footer-bottom ul.menu
  li.last
    border-right: none
    margin: 0
  ul.menu
    display: none

/* 
 ** Comments*/
#comments
  padding: 20px 0 0 0

.comment
  border: 1px solid #ffffff
  -webkit-border-radius: 5px
  -moz-border-radius: 5px
  border-radius: 5px
  padding: 20px
  overflow: hidden
  background: #ffffff
  margin: 0 0 30px 0
  /* shadow */
  -webkit-box-shadow: 0 2px 6px #efefef inset
  -moz-box-shadow: 0 2px 6px #efefef inset
  box-shadow: 0 2px 6px #efefef inset

#comments-title
  border: 1px solid #e7e7e7
  padding: 5px 10px
  display: block
  overflow: hidden
  margin: 0 0 30px 0
  +linear_gradient(#fdfdfd, #efefef)
  +rounded_corners(5px)
  h2
    padding: 0
    margin: 0

#comments-title-left
  float: left
  width: 50%

#comments-title-right
  float: right
  width: 50%
  text-align: right
  .counter
    color: #979696
    font-weight: bold
    font-size: 20px
    background: transparent url('../images/comments.png') no-repeat center left
    padding: 0 0 0 35px

#comments
  h3
    margin: 0
    padding: 10px 0 20px 0
    font-weight: normal
  ul.links
    display: block
    li a
      color: #fefefe
      padding: 5px 10px
      margin: 0 0 0 2px
      text-shadow: 0 1px 1px #003547
      font-weight: bold
      border: none
      font-family: "Lucida Grande","Lucida Sans Unicode",Segoe UI,Helvetica,Arial,sans-serif
      cursor: pointer
      /* radius */
      +rounded_corners(5px)
      /* shadow */
      +box-shadow(0px 1px 2px #939da2)
      &:hover
        text-decoration: none

/*
 ** Poll */

.poll
  .bar .foreground
    background-color: #0092c3
  .title
    padding: 0 0 20px 0

/*
 ** Recent content block */

#block-node-recent
  table, td, table tbody
    border: none
  tr
    &.even, &.odd
      border-bottom: 1px solid #e7e7e7

/*
 ** Search */
#header #block-search-form
  margin: 15px 0 0 0

#block-search-form
  background: #e8e8e8
  border: none
  overflow: hidden
  width: 300px
  float: right
  margin: 13px
  /* Radius */
  +rounded_corners(5px)
  /* shadow */
  +box-shadow(0px 2px 5px #c8c8c8 inset)
  .form-item
    margin: 0
    padding: 0
  input
    &.form-text
      background: none
      border: none
      outline: none
      text-decoration: none
      color: #9f9f9f
      float: left
      width: 70%
      padding: 10px
      margin: 0
      height: 15px
      line-height: 15px
      -webkit-box-shadow: none
      -moz-box-shadow: none
      box-shadow: none
    &.form-submit
      background: none
      border: none
      outline: none
      padding: 6px 10px 0 10px
      float: right


/* 
 ** Messages */

div.messages
  color: #333
  &.status
    background: #52ac61
    border: 1px solid #46a055
    padding: 10px
    margin: 0 0 15px 0
  &.error
    background: #d30000
    border: 1px solid #b50000
    padding: 10px
    margin: 0 0 15px 0
  &.warning
    background: #dd6e0c
    border: 1px solid #d2ac7f
    padding: 10px
    margin: 0 0 15px 0
  &.status a, &.error a, &.warning a
    color: #333
    text-decoration: underline

/*  
 ** Tables */

table
  border-spacing: 0
  border: 0
  width: 100%
  th
    border: 1px solid #bbbbbb
    background: #222222
    color: #ffffff
    font-weight: bold
  tr
    &.odd
      background: transparent
    &.even
      background: #ffffff
  td, th
    padding: 5px
  &.noborder
    td, th, tr
      border: none

/* Remove table borders */

/* 
 ** Lists */

ol
  list-style-type: decimal
  ol
    list-style-type: upper-alpha
    ol
      list-style-type: lower-alpha

li
  display: list-item

.pager-current
  font-weight: bold
  color: #7c713f

.links
  display: block
  text-align: right
  li
    list-style-type: none

.item-list ul
  margin: 0 0 0.25em 1em
  padding: 0
  li
    margin: 0 0 0 5px
    padding: 0 0 5px 5px

ol.search-results
  padding: 0

.links ul li a, a.more
  padding: 7px 15px
  font-weight: bold
  +button_blue()

input
  &[type="submit"], &[type="reset"], &[type="button"]
    /* radius */
    +rounded_corners(5px)
    /* shadow */
    +box-shadow(0px 1px 2px #939da2)

.links ul li a:hover, a.more:hover
  text-decoration: none

input
  &[type="submit"]:hover, &[type="reset"]:hover, &[type="button"]:hover
    text-decoration: none

.resizable-textarea .grippie
  border: 1px solid #dddddd

#edit-submit, #edit-preview
  margin: 0 10px 0 0

#block-search-form input.form-submit
  margin: 0
  border: none
  -webkit-box-shadow: none
  -moz-box-shadow: none
  box-shadow: none
  background: none
  filter: none

ul.inline li
  display: inline-block
  margin: 0
  padding: 10px 5px
  zoom: 1
  *display: inline

input.form-submit
  margin: 0 10px 0 0

/*
 ** Forms */

label
  font-weight: bold

input.form-text
  background: #e8e8e8
  border: 1px solid #f2f2f2
  font-family: "Lucida Grande","Lucida Sans Unicode",Segoe UI,Helvetica,Arial,sans-serif
  height: 25px
  line-height: 25px
  margin: 0
  padding: 2px 5px
  width: 80%
  color: #5f6a5f
  +border-radius(5px)
  //+rounded_corners(5px)
  /* shadow */
  +box-shadow(0px 2px 3px #bcbcbc inset)
  &.error
    border: 2px solid red

textarea
  background: #e8e8e8
  border: 1px solid #f2f2f2
  font-family: "Lucida Grande","Lucida Sans Unicode",Segoe UI,Helvetica,Arial,sans-serif
  margin: 0 20px 10px 0
  padding: 10px 5px
  height: 155px
  font-size: 100%
  color: #5f6a5f
  +rounded_corners(5px)
  /* shadow */
  +box-shadow(0px 2px 3px #bcbcbc inset)

.filter-wrapper
  border: 1px solid #DDDDDD
  border-top: none

/*
 ** Social */

ul.social-bookmarks
  margin: 0
  padding: 0
  li
    display: inline-block
    float: left
    list-style-type: none
    margin: 0
    a
      display: inline-block
      width: 25px
      height: 24px
      padding: 0 3px
      margin: 0 auto
      text-align: center
      overflow: hidden
      outline: none
    &.label
      padding: 0 15px 0 0
    &.facebook a
      background: url('../images/social-media-facebook.png') no-repeat center bottom
    &.twitter a
      background: url('../images/social-media-twitter.png') no-repeat center bottom
    &.rss a
      background: url('../images/social-media-rss.png') no-repeat center bottom
    &.linkedin a
      background: url('../images/social-media-linkedin.png') no-repeat center bottom
    &.delicious a
      background: url('../images/social-media-delicious.png') no-repeat center bottom

/*
 ** Forum */

#forum
  padding: 20px 0

/*
 ** Twitter updates */

.twtr-hd, .twtr-ft
  display: none

.twtr-bd
  display: block
  overflow: hidden

.twtr-widget .twtr-tweet
  border-bottom: 1px solid #353535 !important
  padding: 0 0 5px 0
  margin: 0 0 5px 0

/**
 * Local tasks */

ul
  &.primary, &.tabs
    clear: both
    margin: 10px 0 35px 0
    white-space: normal
  &.primary li, &.tabs li
    padding: 10px 0
    line-height: 130%
  &.primary li a, &.tabs li a
    margin: 0
    padding: 4px 1em
    display: inline-block
    
.item-list
  ul.pager
    margin-top: 10px
    li
      background-color: #8D3133
      padding: 5px 7px
      +rounded_corners(5px)
      color: #fff
      font-weight: bold
      a
        color: #fff
      &:hover
        background-color: #222
        +box-shadow(0 0 3px #000)

/** Page product */
.node-type-product
  .node-product
    .field-name-field-images
      display: block
      float: left
      width: 50%
    .product-title
      display: block
      float: right
      width: 50%
      font-weight: bold
      font-size: 20px
      color: #8D3133
      line-height: 26px
    .group-product-price
      display: block
      float: right
      width: 50%
      top: 20px
      .field
        margin: 10px 0px
      .field-name-commerce-price
        .field-items
          color: #8D3133
          font-weight: bold
      .field-name-field-product
        .form-submit
          padding: 4px 15px
          font-size: 14px
          +button_style(#7EDD0C, #5AB10C, #62AD0C)
    .field-name-body
      padding-top: 20px
#commerce-checkout-form-checkout	  
  .checkout-buttons
    .button-operator
      display: none
    .checkout-cancel, .checkout-back
      +button_blue()
      padding: 0px 6px
      &:hover
        text-decoration: none